@extends('layouts.mobile')

@section('title', '粗耕产销信息平台')

@section('styles')
    <style type="text/css">
        .product-news{
            display: block;
        }

        .product-news .news-item{
            display: block;
            margin-bottom: 10px;
            background-color: #fff;
        }

        .product-news .image{
            padding-top: 60%;
        }

        .product-news .info{
            padding: 10px;
        }

        .product-news .title{
            font-size: 16px;
            line-height: 1.2;
            margin-bottom: 5px;
        }

        .product-news .text{
            font-size: 14px;
            color: #666;
            line-height: 1.6;
        }

        .product-news .display-flex{
            display: flex;
        }

        .product-news .flex{
            flex: 1;
        }
    </style>
@stop

@section('content')
    <div class="product-news">
        @foreach ($items as $item)
            <div class="news-item">
                <a href="{{url('mobile/news/detail/'.$item['id'])}}">
                    <div class="bg-cover image" style="background-image: url({{image_url($item['image'])}})"></div>
                    <div class="info">
                        <div class="title">{{$item['title']}}</div>
                        <div class="display-flex">
                            <div class="text flex">价格:{{$item['price']}}</div>
                            <div class="text">产量:{{$item['quantity'].$item['unit']}}</div>
                        </div>
                        <div class="text">地址:{{$item['province'].$item['city'].$item['district'].$item['street']}}</div>
                    </div>
                </a>
            </div>
        @endforeach
    </div>
@stop
